<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>浙江省城市公交数字可视化平台</title>
        <link rel="stylesheet" href="css/test.css">
    </head>
    <body>
        <header>
            <h1> 浙江省城市公交数字可视化平台</h1>
            <div class="showTime"></div>]
            <script>
            var t = null;
             t = setTimeout(time, 1000);//開始运行
                function time() {
                    clearTimeout(t);//清除定时器
                    dt = new Date();
                    var y = dt.getFullYear();
                    var mt = dt.getMonth() + 1;
                    var day = dt.getDate();
                    var h = dt.getHours();//获取时
                    var m = dt.getMinutes();//获取分
                    var s = dt.getSeconds();//获取秒
                    document.querySelector(".showTime").innerHTML = '当前时间：' + y + "年" + mt + "月" + day + "-" + h + "时" + m + "分" + s + "秒";
                     t = setTimeout(time, 1000); //设定定时器，循环运行     
                }
            </script>
            &
        </header>
        <section class="mainbox">
            <div class="column">
                <div class="panel bar">
                    <h2>城市排名 
                        <a id="yylc" class="tab" href="javacript:;">运营里程</a>
                        <a class="tab" href="javacript:;">运营车辆</a>
                        <a class="tab" href="javacript:;">客运量</a>
                        <a class="tab" href="javacript:;">运营线路</a>
                    </h2>
                    <div class="chart"></div>
                    <div class="panel-footer"></div>
                </div>
                <div class="panel line">
                    <h2>历史趋势
                        <a class="tab" href="javacript:;">运营里程</a>
                        <a class="tab" href="javacript:;">运营车辆</a>
                        <a class="tab" href="javacript:;">客运量</a>
                        <a class="tab" href="javacript:;">运营线路</a>
                    </h2>
                    <div class="chart"></div>
                    <div class="panel-footer"></div>
                </div>
            </div>
            <div class="column">
                <div class="no">
                    <div class="no_hd">
                        <ul>
                            <li>33.48</li>
                            <li>6382</li>
                            <li>24.12</li>
                            <li>593.6</li>
                        </ul>
                    </div>
                    <div class="no_bd">
                        <ul>
                            <li>客运量（亿人次）</li>
                            <li>运营路线（条）</li>
                            <li>运营里程（亿公里）</li>
                            <li>停保场面积（万平方米）</li>
                        </ul>
                    </div>
                </div>
                <div class="map">
                    <div class="map1"></div>
                    <div class="map2"></div>
                    <div class="map3"></div>
                    <div class="chart"></div>
                </div>

            </div>
            <div class="column">
                <div class="panel bar2">
                    <h3>城市公交评价指标</h3>
                    <div class="chart">
                        <table>
                            <thead>
                                <tr>
                                    <th>城市名</th>
                                    <th>500米站点覆盖率</th>
                                    <th>线网覆盖率</th>
                                    <th>线路重复系数</th>
                                </tr>
                            </thead>
                            <tbody>
                                <tr>
                                    <td>杭州</td>
                                    <td>90%</td>
                                    <td>78%</td>
                                    <td>8.15</td>
                                </tr>
                                <tr>
                                    <td>宁波</td>
                                    <td>87%</td>
                                    <td>77%</td>
                                    <td>4.89</td>
                                </tr>
                                <tr>
                                    <td>温州</td>
                                    <td>86%</td>
                                    <td>72%</td>
                                    <td>3.74</td>
                                </tr>
                                <tr>
                                    <td>绍兴</td>
                                    <td>82%</td>
                                    <td>72%</td>
                                    <td>6.52</td>
                                </tr>
                                <tr>
                                    <td>金华</td>
                                    <td>81%</td>
                                    <td>74%</td>
                                    <td>4.20</td>
                                </tr>
                                <tr>
                                    <td>台州</td>
                                    <td>81%</td>
                                    <td>78%</td>
                                    <td>9.62</td>
                                </tr>
                                <tr>
                                    <td>丽水</td>
                                    <td>80%</td>
                                    <td>78%</td>
                                    <td>9.62</td>
                                </tr>
                                <tr>
                                    <td>嘉兴</td>
                                    <td>80%</td>
                                    <td>74%</td>
                                    <td>5.05</td>
                                </tr>
                                <tr>
                                    <td>衢州</td>
                                    <td>80%</td>
                                    <td>71%</td>
                                    <td>4.91</td>
                                </tr>
               
                                </tr>
                            </tbody>
                        </table>
                    </div>
                    <div class="panel-footer"></div>
                </div>
                <div class="panel line2">
                    <h3>城市公共营运车辆构成</h3>
                    <div class="chart"></div>
                    <div class="panel-footer"></div>
                </div>
            </div>
        </section>
        <script src="js/flexible.js"></script>
        <script src="js/echarts.min.js"></script>
        <!-- 先引入jquery -->
        <script src="js/jquery.js"></script>
        <!-- 必须先引入china.js 这个文件 因为中国地图需要 -->
        <script src="js/china.js"></script>
        <script src="js/zhejiang.js"></script>
        <script src="js/test.js"></script>
    </body>
</html>
